import 'package:flutter/material.dart';
import 'package:reader_app/page_card/base_card.dart';

const BOOL_LIST = [
  {"title": "暴力沟通", "cover": "51VykQqGq9L._SY346_.jpg", "price": "19.6"},
  {"title": "论中国", "cover": "51vzcX1U1FL.jpg", "price": "19.6"},
  {"title": "第三本书", "cover": "51VykQqGq9L._SY346_.jpg", "price": "19.6"},
  {"title": "饥饿的世界:乾隆时代的得与失", "cover": "51VykQqGq9L._SY346_.jpg", "price": "19.6"},
  {"title": "暴力沟通，不吼不叫面对孩子", "cover": "51VykQqGq9L._SY346_.jpg", "price": "19.6"},
  {"title": "坚持就是胜利", "cover": "51VykQqGq9L._SY346_.jpg", "price": "19.6"},
];

class CardFree extends BaseCard {
  @override
  CardFreeState createState() => CardFreeState();
}

class CardFreeState extends BaseCardState {
  @override
  Widget topTitle(String topTitle) {
    return super.topTitle("免费听书馆");
  }

  @override
  Widget subTitle(String title) {
    return super.subTitle("第 108 期");
  }

  @override
  Widget bottomContent() {
    //这里要充满
    return new Expanded(
      child: new Column(
        children: <Widget>[
          new Expanded(child: _bookList()),
          new Padding(
            padding: EdgeInsets.only(bottom: 20),
            child: _bottomButton(),
          )
        ],
      ),
    );
  }

  ///创建听书列表
  Widget _bookList() {
    return GridView.count(
      crossAxisCount: 3,
      mainAxisSpacing: 10,
      crossAxisSpacing: 10,
      childAspectRatio: 0.53,
      padding: EdgeInsets.only(left: 20, right: 20),
      children: BOOL_LIST.map((item) {
        return _createBookItem(item);
      }).toList(),
    );
  }

  ///创建领取按钮
  Widget _bottomButton() {
    //填充布局
    return FractionallySizedBox(
      widthFactor: 1,
      child: new Padding(
        padding: EdgeInsets.only(left: 20, right: 20),
        child: new RaisedButton(
          onPressed: () {},
          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
          color: Colors.blue,
          hoverColor: Colors.blue[100],
          child: new Text(
            "免费领取",
            style: new TextStyle(fontSize: 13, color: Colors.white),
          ),
        ),
      ),
    );
  }

  Widget _createBookItem(Map<String, String> item) {
    return new Container(
      child: new Column(
        children: <Widget>[
          new Stack(
            alignment: AlignmentDirectional.center,
            children: <Widget>[
              Image.network(
                "https://www.devio.org/io/flutter_beauty/book_cover/${item["cover"]}",
                fit: BoxFit.cover,
              ),
              new Container(
                  width: 30,
                  height: 30,
                  decoration: BoxDecoration(borderRadius: BorderRadius.circular(20), color: Colors.black),
                  child: new Icon(
                    Icons.play_arrow,
                    color: Colors.white,
                  )),
              new Positioned(
                  bottom: 0,
                  left: 0,
                  right: 0,
                  child: new Container(
                    padding: EdgeInsets.only(left: 5),
                    decoration: new BoxDecoration(color: Colors.black45),
                    child: new Text(
                      '原价${item["price"]}',
                      style: new TextStyle(fontSize: 11, color: Colors.white),
                    ),
                  ))
            ],
          ),
          new Text(
            "${item["title"]}",
            style: new TextStyle(
              fontSize: 14,
              color: Colors.black87,
            ),
            maxLines: 2,
            overflow: TextOverflow.ellipsis,
          )
        ],
      ),
    );
  }
}
